import React, { FC } from 'react'
import { Menu } from 'antd'
import route from '../../Router/index'
import logo from '@/assets/image/logo.png'
import { Link, useHistory } from 'react-router-dom'
import './headers.less'
interface Props {}
const { SubMenu } = Menu

const Headers: FC<Props> = props => {
	const history = useHistory()
	const menuLink = (data:any) => {
		history.push(`${data.key}`)

		/* 先查出标签是否以及存在,如果存在直接高亮即可,如果不存在,才去添加标签 */
	}
	const menu = () => {
		return (
			<Menu style={{ backgroundColor: '#01967F' }} onClick={menuLink}>
				{route.map(item => (
					<Menu.Item
						key={item.key}
						icon={<item.icon style={{ color: '#fff', fontSize: '16px' }} />}>
						{item.name}
					</Menu.Item>
				))}
			</Menu>
		)
	}
	return (
		<div className='container-header'>
			<div className='logo_image'>
				<img className='logo' src={logo} alt='' />
			</div>
			{menu()}
		</div>
	)
}
export default Headers
